<template>
    <a-drawer
    :title="title"
    placement="right"
    width="70%"
    :maskClosable="false" 
    :visible="log_drawer_visible"
    @close="log_drawer_close"
    class="my-drawer"
    >
    <div class="log-p-div">
        <p :key="index" v-for="(line, index) in logs" style="margin-bottom: 5px;" >{{ line }}
            <a-divider />
        </p>
    </div>
</a-drawer>
</template>
<script>
export default {
    components: {},
    data() {
        return {
            log_drawer_visible: false,
            logs:[],
            name:"",
            title:"",



            //mitt
            mitt_show_node_log_modal_id:"",
            mitt_show_node_log_modal_back_id:"",
        };
    },
    mounted() {
        this.mitt_show_node_log_modal_id=this.$mitt.on('show_node_log_modal',(uid,data) => {
            this.mitt_show_node_log_modal_back_id=uid
            this.logs=[]
            this.log_drawer_visible = true;
            let node_type=data?.type
            if(node_type=="process"){
                this.name=data?.name
                this.title=`${this.name}节点-实时日志查看`
                this.$socket.emit("web_get_node_log", {
                    name:this.name,
                    send:true
                })
                this.$socket.on("send_node_log", async (node_log) => {
                    this.logs.push(node_log?.log)
                });
            }
            // else if(node_type=="server"){
            //     this.name=data?.name
            //     this.title=`server节点-实时日志查看`
            //     this.$socket.emit("web_get_node_log", {
            //         name:this.name,
            //         send:true
            //     })
            //     this.$socket.on("send_node_log", async (node_log) => {
            //         this.logs.push(node_log?.log)
            //     });
            // }
            



            
            
            
        });
    },
    beforeUnmount() {
        this.$mitt.off('show_node_log_modal',this.mitt_show_node_log_modal_id);
    },
    methods: {
        log_drawer_close() {
            this.$socket.emit("web_get_node_log", {
                name:this.name,
                send:false
            })
            this.log_drawer_visible = false
        },
        change_p_scrollTop(){
            let div = document.getElementsByClassName('log-p-div')[0];
            div.scrollTop = div?.scrollHeight;
        },
    },
};
</script>
<style>
.my-drawer .ant-drawer-body {
    padding: 8px;
    font-size: 12px;
}
.my-drawer .ant-divider {
    margin: 10px 0;
}
</style>
